<script>
// $refs $children $parent
import {defineComponent} from 'vue'
import Child from "@/components/Child.vue";

export default defineComponent({
    name: "App",
    data(){
        return {
            money:200
        }
    },
    methods:{
        fn(){
           this.$refs.son.money-=100;
           this.money+=100;
        },
        fn2(){
            // console.log(this.$children[0] === this.$refs.son);// true
            this.$children[0].money-=200;
            this.money+=200;
        }
    },
    components: {Child}
})
</script>

<template>
    <div>
        <h3>App</h3>
        <p>父亲有{{money}}元</p>
        <button @click="fn">管儿子要100元</button>
        <button @click="fn2">管儿子要200元</button>
        <hr/>
        <Child ref="son"/>
    </div>
</template>

<style scoped>

</style>